<template>
  <!--  <div class="foot">-->
  <!--    <p class="item1">公司地址：广东省广州市番禺区华南理工大学</p>-->
  <!--    <p class="item2">联系方式：华南理工大学大学城校区软件学院</p>-->
  <!--    <p class="item3">2020华南理工大学ibm实验室区块链组</p>-->
  <!--  </div>-->
  <div class="footer" style="box-shadow: 0 -2px 15px 2px rgba(14, 14, 0, 0.4);">
    <div class="footer-main">
      <div class="ivu-row" style="margin-left: 20px;">
        <div class="ivu-col ivu-col-span-5"><h4><i class="ivu-icon ivu-icon-logo-github"></i>
          Gitee
        </h4>
          <ul>
            <li><a href="https://gitee.com/Linrena/blockchainmusic" target="_blank">Frontend</a></li>
            <li><a href="https://gitee.com/Linrena/blockchainmusic_backend" target="_blank">Backend</a></li>
            <!--            <li><a href="https://github.com/view-design/iview-project" target="_blank">View UI Project</a></li>-->
            <!--            <li><a href="https://github.com/view-design/vue-cli-plugin-iview" target="_blank">View UI Plugin</a></li>-->
          </ul>
        </div>
        <div class="ivu-col ivu-col-span-5"><h4><i class="ivu-icon ivu-icon-ios-link"></i>
          社区
        </h4>
          <ul>
            <li><a href="http://www.abletive.com/" target="_blank">电子音乐社区</a>
            </li>
            <li><a href="https://www.hp9v.com/" target="_blank">9V音乐社区</a>
            </li>
            <li>
              <!--              <div class="ivu-row">-->
              <!--                <div class="ivu-col ivu-col-span-5">-->
              <!--                  <div class="ivu-poptip">-->
              <!--                    <div class="ivu-poptip-rel"><a href="javascript:void(0)" target="_blank"><img-->
              <!--                      src="https://file.iviewui.com/dist/c69ec08c402317033b98fd63280a1a3e.svg"-->
              <!--                      class="footer-social-icon"></a></div>-->
              <!--                    <div class="ivu-poptip-popper"-->
              <!--                         style="position: absolute; will-change: top, left; display: none; top: 0px; left: 16px;"-->
              <!--                         x-placement="top">-->
              <!--                      <div class="ivu-poptip-content">-->
              <!--                        <div class="ivu-poptip-arrow"></div> &lt;!&ndash;&ndash;&gt;-->
              <!--                        <div class="ivu-poptip-inner">-->
              <!--                          &lt;!&ndash;                          <div class="ivu-poptip-title">&ndash;&gt;-->
              <!--                          &lt;!&ndash;                            <div class="ivu-poptip-title-inner">扫一扫，关注 View UI 公众号</div>&ndash;&gt;-->
              <!--                          &lt;!&ndash;                          </div>&ndash;&gt;-->
              <!--                          <div class="ivu-poptip-body">-->
              <!--                            <div class="ivu-poptip-body-content">-->
              <!--                              <div><img src="https://file.iviewui.com/dist/e625ae52cf7e2f3f3486ef1cf1f4f968.png"-->
              <!--                                        class="footer-qr"></div>-->
              <!--                            </div>-->
              <!--                          </div>-->
              <!--                        </div>-->
              <!--                      </div>-->
              <!--                    </div>-->
              <!--                  </div>-->
              <!--                </div>-->
              <!--                <div class="ivu-col ivu-col-span-5">-->
              <!--                  <div class="ivu-poptip">-->
              <!--                    <div class="ivu-poptip-rel"><a href="javascript:void(0)" target="_blank"><img-->
              <!--                      src="https://file.iviewui.com/dist/2cf4276d77f895fc06354af1eb480b8e.svg"-->
              <!--                      class="footer-social-icon"></a></div>-->
              <!--                    <div class="ivu-poptip-popper"-->
              <!--                         style="display: none; position: absolute; will-change: top, left; top: 0px; left: 16px;"-->
              <!--                         x-placement="top">-->
              <!--                      <div class="ivu-poptip-content">-->
              <!--                        <div class="ivu-poptip-arrow"></div> &lt;!&ndash;&ndash;&gt;-->
              <!--                        <div class="ivu-poptip-inner">-->
              <!--                          <div class="ivu-poptip-title">-->
              <!--                            <div class="ivu-poptip-title-inner">扫一扫，免费加入 QQ 群</div>-->
              <!--                          </div>-->
              <!--                          <div class="ivu-poptip-body">-->
              <!--                            <div class="ivu-poptip-body-content">-->
              <!--                              <div><img src="https://file.iviewui.com/dist/6980d3aa2a1a58873198f7556a7cbcd5.png"-->
              <!--                                        class="footer-qr"></div>-->
              <!--                            </div>-->
              <!--                          </div>-->
              <!--                        </div>-->
              <!--                      </div>-->
              <!--                    </div>-->
              <!--                  </div>-->
              <!--                </div>-->
              <!--                <div class="ivu-col ivu-col-span-5">-->
              <!--                  <div class="ivu-tooltip">-->
              <!--                    <div class="ivu-tooltip-rel"><a href="https://zhuanlan.zhihu.com/feview" target="_blank"><img-->
              <!--                      src="https://file.iviewui.com/dist/1dc5a4ffa3f5c21adcbb3464dd9a8021.svg"-->
              <!--                      class="footer-social-icon"></a></div>-->
              <!--                    <div class="ivu-tooltip-popper ivu-tooltip-dark"-->
              <!--                         style="display: none; position: absolute; will-change: top, left; top: 0px; left: 16px;"-->
              <!--                         x-placement="top">-->
              <!--                      <div class="ivu-tooltip-content">-->
              <!--                        <div class="ivu-tooltip-arrow"></div>-->
              <!--                        <div class="ivu-tooltip-inner">知乎专栏</div>-->
              <!--                      </div>-->
              <!--                    </div>-->
              <!--                  </div>-->
              <!--                </div>-->
              <!--              </div>-->
              <!--              <div class="ivu-row" style="padding: 0px;">-->
              <!--                <div class="ivu-col ivu-col-span-5">-->
              <!--                  <div class="ivu-tooltip">-->
              <!--                    <div class="ivu-tooltip-rel"><a href="https://twitter.com/iViewUI" target="_blank"><img-->
              <!--                      src="https://file.iviewui.com/dist/5db80e8196980d550153dcc3a33934b3.svg"-->
              <!--                      class="footer-social-icon"></a></div>-->
              <!--                    <div class="ivu-tooltip-popper ivu-tooltip-dark"-->
              <!--                         style="display: none; position: absolute; will-change: top, left; top: 0px; left: 16px;"-->
              <!--                         x-placement="top">-->
              <!--                      <div class="ivu-tooltip-content">-->
              <!--                        <div class="ivu-tooltip-arrow"></div>-->
              <!--                        <div class="ivu-tooltip-inner">Twitter</div>-->
              <!--                      </div>-->
              <!--                    </div>-->
              <!--                  </div>-->
              <!--                </div>-->
              <!--                <div class="ivu-col ivu-col-span-5">-->
              <!--                  <div class="ivu-tooltip">-->
              <!--                    <div class="ivu-tooltip-rel"><a href="https://juejin.im/user/56fe494539b0570054f2e032"-->
              <!--                                                    target="_blank"><img-->
              <!--                      src=""-->
              <!--                      class="footer-social-icon footer-social-icon-bg"></a></div>-->
              <!--                    <div class="ivu-tooltip-popper ivu-tooltip-dark"-->
              <!--                         style="display: none; position: absolute; will-change: top, left; top: 0px; left: 16px;"-->
              <!--                         x-placement="top">-->
              <!--                      <div class="ivu-tooltip-content">-->
              <!--                        <div class="ivu-tooltip-arrow"></div>-->
              <!--                        <div class="ivu-tooltip-inner">掘金</div>-->
              <!--                      </div>-->
              <!--                    </div>-->
              <!--                  </div>-->
              <!--                </div>-->
              <!--                <div class="ivu-col ivu-col-span-5">-->
              <!--                  <div class="ivu-tooltip">-->
              <!--                    <div class="ivu-tooltip-rel"><a href="https://live.bilibili.com/1353202" target="_blank"><img-->
              <!--                      src="https://file.iviewui.com/dist/2054f5af8012b54926ed6b5cfd1f166c.svg"-->
              <!--                      class="footer-social-icon"></a></div>-->
              <!--                    <div class="ivu-tooltip-popper ivu-tooltip-dark"-->
              <!--                         style="display: none; position: absolute; will-change: top, left; top: 0px; left: 16px;"-->
              <!--                         x-placement="top">-->
              <!--                      <div class="ivu-tooltip-content">-->
              <!--                        <div class="ivu-tooltip-arrow"></div>-->
              <!--                        &lt;!&ndash;                        <div class="ivu-tooltip-inner">活动直播间</div>&ndash;&gt;-->
              <!--                      </div>-->
              <!--                    </div>-->
              <!--                  </div>-->
              <!--                </div>-->
              <!--              </div>-->
            </li>
          </ul>
        </div>
        <div class="ivu-col ivu-col-span-5 ivu-col-offset-2"><h4><i class="ivu-icon ivu-icon-ios-chatbubbles"></i>
          帮助
        </h4>
          <ul>
            <li><a href="https://gitee.com/Linrena/blockchainmusic" target="_blank">更新日志</a></li>
            <li><a href="https://gitee.com/Linrena/blockchainmusic/issues" target="_blank">报告 Bug</a></li>
          </ul>
        </div>
        <div class="ivu-col ivu-col-span-5 ivu-col-offset-2">
          <div class="footer-aside">
            <div class="footer-author"><a href="https://www.maoyun.com/?ref=iview" target="_blank"><img
              src="https://file.iviewui.com/dist/bfd1ef55f01a2fcf36888660e27d8874.svg"></a></div>
            <div class="footer-version footer-version-cdn"><p>提供 CDN 赞助</p></div>
            <!--            <div class="footer-author"><a href="https://www.mysubmail.com/?ref=iview" target="_blank"><img-->
            <!--              src="https://file.iviewui.com/dist/4e55eb138cb06b2fcf56839f9aefbd32.svg" class="long"></a></div>-->
            <!--            <div class="footer-version footer-version-mail"><p>提供邮件服务赞助</p></div>-->
          </div>
        </div>
      </div>
    </div>
    <div class="footer-copyright" style="margin-top: 10px">
      <p>Copyright © 2020 华南理工大学大学城校区软件学院 | IBM实验室区块链组</p>
    </div>
  </div>
</template>

<script>
export default {
  name: 'FooterVue'
}
</script>

<style scoped>
.foot {
  width: 100%;
  text-align: center;
  background-color: #212121;
  box-shadow: 0 -2px 15px 2px rgba(14, 14, 0, 0.4);
  font-family: Roboto, '方正兰亭细黑', "Roboto Light", "Microsoft YaHei", serif;
}

.item1 {
  line-height: 15px;
  padding-top: 15px;
  color: #e5e9f2;
  font-size: 15px
}

.item2 {
  line-height: 15px;
  color: #e5e9f2;
  padding: 15px;
  font-size: 15px
}

.item3 {
  line-height: 15px;
  color: #e5e9f2;
  padding-bottom: 15px;
  font-size: 15px
}

</style>
